<form nz-form #validateForm="ngForm" (ngSubmit)="submitForm()" nzLayout="horizontal" autocomplete="off">
  <!-- 模态框头部 -->
  <div class="modal-header">
    <div class="modal-title">
      <i class="anticon anticon-medicine-box mr-sm"></i>
      <span *ngIf="entity.id">{{l('Edit')}}</span>
      <span *ngIf="!entity.id">{{l('Create')}}</span>
    </div>
  </div>
  <!-- 模态框内容 -->
  <fieldset>
    <!-- 提示信息 -->
    <!-- <nz-alert nzType="info" nzCloseable [nzShowIcon]="true" nzMessage="l('我想提示点什么内容给你说')"></nz-alert> -->
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="6" [nzXs]="24" nzRequired nzFor="bookName">{{l('BookName')}}</nz-form-label>
      <nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback>
        <input nz-input name="bookName" #bookName="ngModel" [(ngModel)]="entity.bookName" [placeholder]="l('BookName')"
          required maxlength='50' minlength='1'>

        <!-- 校验 -->
        <nz-form-explain *ngIf="bookName.control.dirty&&bookName.control.errors">
          <ng-container *ngIf="bookName.control.hasError('maxlength')">{{l('超过最大长度')+50}}</ng-container>
          <ng-container *ngIf="bookName.control.hasError('minlength')">{{l('小于最小长度')+1}}</ng-container>
          <ng-container *ngIf="bookName.control.hasError('required')">{{l('CanNotNull')}}</ng-container>
        </nz-form-explain>

      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="6" [nzXs]="24" nzRequired nzFor="bookAuthor">{{l('BookAuthor')}}</nz-form-label>
      <nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback>
        <input nz-input name="bookAuthor" #bookAuthor="ngModel" [(ngModel)]="entity.bookAuthor" [placeholder]="l('BookAuthor')"
          required maxlength='50' minlength='1'>

        <!-- 校验 -->
        <nz-form-explain *ngIf="bookAuthor.control.dirty&&bookAuthor.control.errors">
          <ng-container *ngIf="bookAuthor.control.hasError('maxlength')">{{l('超过最大长度')+50}}</ng-container>
          <ng-container *ngIf="bookAuthor.control.hasError('minlength')">{{l('小于最小长度')+1}}</ng-container>
          <ng-container *ngIf="bookAuthor.control.hasError('required')">{{l('CanNotNull')}}</ng-container>
        </nz-form-explain>

      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label nz-col [nzSm]="6" [nzXs]="24" nzRequired nzFor="bookIntro">{{l('BookIntro')}}</nz-form-label>
      <nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback>
        <textarea nz-input name="bookIntro" #bookIntro="ngModel" [(ngModel)]="entity.bookIntro" [placeholder]="l('BookIntro')"
          nzAutosize required maxlength='300' minlength='10'></textarea>

        <!-- 校验 -->
        <nz-form-explain *ngIf="bookIntro.control.dirty&&bookIntro.control.errors">
          <ng-container *ngIf="bookIntro.control.hasError('maxlength')">{{l('超过最大长度')+300}}</ng-container>
          <ng-container *ngIf="bookIntro.control.hasError('minlength')">{{l('小于最小长度')+10}}</ng-container>
          <ng-container *ngIf="bookIntro.control.hasError('required')">{{l('CanNotNull')}}</ng-container>
        </nz-form-explain>

      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="priceUrl">{{l('PriceUrl')}}</nz-form-label>
      <nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback>
        <input nz-input name="priceUrl" #priceUrl="ngModel" [(ngModel)]="entity.priceUrl" [placeholder]="l('PriceUrl')">


      </nz-form-control>
    </nz-form-item>
    <nz-form-item nz-row>
      <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="imgUrl">{{l('ImageUrl')}}</nz-form-label>
      <nz-form-control nz-col [nzSm]="14" [nzXs]="24" nzHasFeedback>
        <input nz-input name="imgUrl" #imgUrl="ngModel" [(ngModel)]="entity.imageUrl" [placeholder]="l('ImageUrl')">


      </nz-form-control>
    </nz-form-item>

  </fieldset>
  <!-- 模态框底部 -->
  <div class="modal-footer">
    <button nz-button [nzType]="'default'" type="button" (click)="close()" [disabled]="saving">
      <i class="anticon anticon-close-circle-o"></i> {{l("Cancel")}}
    </button>
    <button nz-button [nzType]="'primary'" type="submit" [disabled]="!validateForm.form.valid|| saving" [nzLoading]="saving">
      <i class="anticon anticon-save" *ngIf="!saving"></i> {{l("Save")}}
    </button>
  </div>
</form>
